<template>
	<view class="page">
		<view class="header_box">
			<view class="nav_box">
				<view class="left_box">
					<view class="fanhui_box" @click="fanhui">
						<u-icon name="arrow-left" color="#fff" size="52"></u-icon>
					</view>
				</view>
				<view class="middle_box" v-if="Object.keys(Lord).length > 0 || boxType == 0 || boxType == 1"
					@click="lingzhuopen">
					<view class="mid_left_box">
						<image :src="Lord.avatar" mode="scaleToFill" />
					</view>
					<view class="mid_right_box">
						<view class="mid_right_top_txt">天下霸主{{ Lord.nick_name }}</view>
						<view class="mid_right_bot_txt">占榜{{ Lord.minutes || '' }}分钟，免费赢得{{ Lord.reward || '' }}大王币</view>
					</view>
				</view>
				<view class="yxcSty" v-if="boxType == 2">
					<view class="yxc_name_box">倒计时</view>
					<view class="djs_box">
						<u-count-down bg-color="none" ref="uCountDown" separator-color="#A40000" :show-days="false"
							color="#A40000" :timestamp="xqObj.reset_day" @end="endTime"></u-count-down>
					</view>
				</view>
				<view class="right_box">
					<view class="kefu_box" @click="enterkefu()">
						<image src="https://mh.qingfentool.vip/upload/image/20230513/510f4f36780dbc7fd0a479b46f32830f.png"
							mode="scaleToFill" />
					</view>
				</view>
			</view>
		</view>
		<view class=""></view>
		<!-- 轮播 -->
		<view class="swiper_big_box">
			<view class="uni-margin-wrap">
				<swiper class="swiper" circular next-margin="190rpx" previous-margin="200rpx"
					:indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
					<swiper-item v-for="(item, index) in fifterList" :key="index">
						<view class="swiper-item uni-bg-red"
							:style="{ backgroundImage: 'url(' + item.bg + ')', backgroundSize: '100% 100%' }">
							<view class="swiper_pic_box">
								<image :src="item.carousel_icon" mode="widthFix" />
							</view>
							<view class="swiper_name_box">{{ item.name }}</view>
							<view class="swiper_prc_box">￥{{ item.price }}</view>
						</view>
					</swiper-item>
				</swiper>
			</view>
		</view>
		<!-- 未成年人 -->
		<view class="weichengnian_box">未成年人禁止使用，商品抽奖存在概率性，付费请谨慎</view>
		<!-- 步进器 -->
		<view class="bujinqi_box">
			<view class="money_box">
				<view class="yanjing" @click="dianjiyanjing">
					<image v-if="seen == false"
						src="https://new.qingfentool.vip/upload/image/20230610/f8a79a07b4d75a89014c3428d5356627.png"
						mode="scaleToFill" />
					<text style="color:#fff;font-size: 24rpx;" v-if="seen == true">{{ '￥' + yueNum }}</text>
				</view>
			</view>
			<view class="num_txt_box">
				<template v-if="boxType == 1">
					<view class="num_box">
						<uni-number-box :min="1" :max="Number(this.xqObj.multiple)" @change="changeValue"
							@blur="blurValue"></uni-number-box>
					</view>
					<!-- <view class="text_box">倍开箱</view> -->
				</template>
				<template v-if="boxType == 2">
					<view class="shengyu_chou_box">剩余{{ shengyuNum }}/总抽{{ zongNum }}</view>
				</template>
			</view>
			<view class="wanfa_box" @click="wanfaBtn()">玩法</view>
			<!-- 最近开出 -->
			<view class="zuijinkaichu" @click="zuijinBtn()">
				最近开出
			</view>
		</view>
		<template v-if="upOpenStatus == false">
			<!-- 传说 -->
			<view class="shenhua_box" v-if="shenhuaList.length > 0">
				<view class="box_title">
					<view class="title_pic_box">
						<image src="https://new.qingfentool.vip/upload/image/20230701/1c389a152a916c1d96774a35a51a5811.png"
							mode="scaleToFill" />
					</view>
					<view class="title_dj_box">大王赏</view>
					<view class="title_gv_box">获得概率{{ shenhuagv }}%</view>
				</view>
				<!-- 列表 -->
				<scroll-view scroll-x class="dj_list_box">
					<view class="dan_big_box">
						<view class="dan_box" v-for="(item, index) in  shenhuaList" :key="index"
							@click="shopDeatilBtn(item)">
							<view class="dan_pic_box">
								<image :src="item.carousel_icon" mode="scaleToFill" />
							</view>
							<view class="dan_name_box">{{ item.name }}</view>
							<view class="dan_name_box">￥ {{ item.price }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<!-- 神话 -->
			<view class="chuanshuo_box" v-if="chuanshuoList.length > 0">
				<view class="box_title">
					<view class="title_pic_box">
						<image src="https://new.qingfentool.vip/upload/image/20230701/bffd918b2140d8dd94642f6eae5fbaf4.png"
							mode="scaleToFill" />
					</view>
					<view class="title_dj_box">将军赏</view>
					<view class="title_gv_box">获得概率{{ chuanshuogv }}%</view>
				</view>
				<!-- 列表 -->
				<scroll-view scroll-x class="dj_list_box">
					<view class="dan_big_box">
						<view class="dan_box" v-for="(item, index) in chuanshuoList" :key="index"
							@click="shopDeatilBtn(item)">
							<view class="dan_pic_box">
								<image :src="item.carousel_icon" mode="scaleToFill" />
							</view>
							<view class="dan_name_box">{{ item.name }}</view>
							<view class="dan_name_box">￥ {{ item.price }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<!-- 稀有 -->
			<view class="xiyou_box" v-if="xiyouList.length > 0">
				<view class="box_title">
					<view class="title_pic_box">
						<image src="https://new.qingfentool.vip/upload/image/20230701/e7bf5bdcbd8d2081a28f9a4a39ec58bd.png"
							mode="scaleToFill" />
					</view>
					<view class="title_dj_box">稀有</view>
					<view class="title_gv_box">获得概率{{ xiyougv }}%</view>
				</view>
				<!-- 列表 -->
				<scroll-view scroll-x class="dj_list_box">
					<view class="dan_big_box">
						<view class="dan_box" v-for="(item, index) in xiyouList" :key="index" @click="shopDeatilBtn(item)">
							<view class="dan_pic_box">
								<image :src="item.carousel_icon" mode="scaleToFill" />
							</view>
							<view class="dan_name_box">{{ item.name }}</view>
							<view class="dan_name_box">￥ {{ item.price }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<!--普通  -->
			<view class="putong_box" v-if="putongList.length > 0">
				<view class="box_title">
					<view class="title_pic_box">
						<image src="https://new.qingfentool.vip/upload/image/20230701/5677f232a0ce2fda9b1008774e841d1e.png"
							mode="scaleToFill" />
					</view>
					<view class="title_dj_box">普通</view>
					<view class="title_gv_box">获得概率{{ putonggv }}%</view>
				</view>
				<!-- 列表 -->
				<scroll-view scroll-x class="dj_list_box">
					<view class="dan_big_box">
						<view class="dan_box" v-for="(item, index) in putongList" :key="index" @click="shopDeatilBtn(item)">
							<view class="dan_pic_box">
								<image :src="item.carousel_icon" mode="scaleToFill" />
							</view>
							<view class="dan_name_box">{{ item.name }}</view>
							<view class="dan_name_box">￥ {{ item.price }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</template>
		<template v-if="upOpenStatus == true">
			<view class="zuijinOpen_box">
				<view class="top_box">
					<view class="open_left_box">
						<u-icon @click="departure" name="arrow-left" size="50" color="#FFAA01"></u-icon>
					</view>
					<view class="open_right_box">
						<view :class="item.type == recentChecked ? 'open_dange_box1' : 'open_dange_box'"
							v-for="item, index in  zjOpenBtnList" :key="index" @click="openType(item)">{{ item.text }}
						</view>
					</view>
				</view>
				<scroll-view scroll-y class="zuijinScroll_box" @scrolltolower="quanbuLower" :scroll-top="scrollTop"
					@scroll="scroll">
					<view class="jushangci_box" v-if="recentChecked != 0">距离上一次开出大王赏已开出X<text
							:class="recentChecked == 1 ? 'xiyou_box' : recentChecked == 2 ? 'mowang_box' : recentChecked == 3 ? 'dawang_box' : ''"
							style="font-size:36rpx;font-weight: 700;">{{ shishiKc }}</text>份</view>
					<view v-for="( item, index ) in  recentList " :key="index"
						:class="item.level == 3 ? 'zuijinScroll_dange_box3' : item.level == 2 ? 'zuijinScroll_dange_box2' : item.level == 1 ? 'zuijinScroll_dange_box1' : item.level == 0 ? 'zuijinScroll_dange_box0' : 'zuijinScroll_dange_box'">

						<view class="nox_box">
							<view class="reheader_box">
								<view class="txk_box">
									<image :src="item.frameless_head" mode="scaleToFill" />
								</view>
								<view class="tx_box">
									<image :src="item.avatar" mode="scaleToFill" />
								</view>
							</view>
							<view class="retext_box" v-if="item.leader_amount == 0">
								<view class="retop_box">
									<view class="releft_box">{{ item.nickname }}</view>
									<view class="reright_box">NO.{{ item.id }}</view>
								</view>
								<view class="rebot_box">
									<view class="reeeleft_box" v-if="item.leader_amount == 0">{{ item.prize_name }}
									</view>
									<view class="reeert_box" v-if="boxType == 1">x{{ item.pay_mode }}</view>
								</view>
							</view>
							<view class="retext_box" v-if="item.leader_amount > 0">
								<view class="leader_box"><text>{{ item.nickname }}</text><text style="float:right;">霸主结算：{{
									item.leader_amount
								}}大王币</text></view>
							</view>
							<view class="reimg_box">
								<image v-if="item.leader_amount == 0" :src="item.prize_icon" mode="scaleToFill" />
							</view>
						</view>
						<view class="last_num" v-if="recentChecked != 0">x{{ item.diff_time }}发</view>
						<view class="line_box"></view>
					</view>
				</scroll-view>
			</view>
		</template>
		<view style="height:210rpx;" v-if="showSpeed == true"></view>
		<view style="height:138rpx;" v-else></view>
		<!-- 抽奖按钮 -->
		<view :class="showSpeed ? 'bot_butn_box' : 'bot_butn_box1'">
			<view class="double_box" v-if="showSpeed == true">
				<view class="double_one_box">
					<view class="jdt_box">
						<progressbar v-model="powerValue" min="0" max="100" height="26"></progressbar>
					</view>
					<view class="baifenbi_box">{{ (powerValue * 1).toFixed(2) }}%</view>
				</view>
				<view class="double_anniu_box">
					<view class="jiebeika_box" @click="doubleBtn">加倍卡X{{ speedNnum }}</view>
					<view class="jiebeika_txt_box">怒气值100%可获得加倍卡x1</view>
					<view class="jiebeika_guize_box" @click="ruleDouble">加倍规则</view>
				</view>
			</view>
			<view class="cjanniu_box">
				<view class="one_open_box" @click="oneBtn()"></view>
				<view class="three_open_box" @click="threeBtn()"></view>
				<view class="five_open_box" @click="fiveBtn()"></view>
				<view class="ten_open_box" @click="tenBtn()"></view>
			</view>
		</view>
		<!-- 商品详情 -->
		<uni-popup ref="shopDetilPopup" type="bottom">
			<scroll-view scroll-y class="shangpin_box">
				<view class="title_box">
					<h5>商品详情</h5>
					<view class="chahao" @click="guanbixiangqing">
						<image src="https://mh.qingfentool.vip/upload/image/20230313/bab4d5360d2c14b584ecb7ab53c684e2.png"
							mode="scaleToFill" />
					</view>
				</view>
				<view class="shangpin_top_box">

					<view class="xiangqing_pic">
						<view class="pic">
							<u-swiper :list="detailPicList" indicator-pos="bottomRight" mode="number" height="292"
								bg-color="#F5F7FB"></u-swiper>
						</view>
					</view>
				</view>
				<view class="jiage_box">
					<view class="price_box">
						<text>￥</text>{{ detailObj.price }}
					</view>
					<view class="name_box">
						{{ detailObj.title }}
					</view>
				</view>
				<view class="guanggao">
					<image src="https://mh.qingfentool.vip/upload/image/20230529/9e42d3fd53ed8737ecfe5f675d7583fc.png"
						mode="scaleToFill" />
				</view>
				<view class="fenge">
					<view class="xiaotxt">
						<u-divider half-width="50" bg-color="#F5F7FB" color="#FFAE2A" border-color="#CBCBCB" fontSize="36"
							height="52">商品详情</u-divider>
					</view>
				</view>
				<rich-text :nodes="goods_introduce"></rich-text>
			</scroll-view>
		</uni-popup>
		<!-- 支付弹窗 -->
		<uni-popup ref="popup" type="bottom" :mask-click="false">

			<view class="cld">
				<!-- 支付顶部 -->
				<view class="zf_top_box">
					<view class="fanhuibtn_box" @tap="zftkgb">
						<image src="https://new.qingfentool.vip/upload/image/20230610/d20b8c0eaf5de5f1e788a8da5eb43e8e.png"
							mode=""></image>

					</view>
					<view class="shangpin_txt">
						{{ xqObj.name }}
					</view>
				</view>

				<!-- 优惠 -->
				<view class="youhui_box">
					<view class="youhuiquan_box">优惠券</view>
					<view class="xuanzequan_box" @tap="youhuiopen" v-if="yhqNum == 0">选择优惠券></view>
					<view class="xuanzequan_box" @tap="youhuiopen" v-if="yhqNum > 0"><text style="color:#FF5F5F;">-{{
						yhqNum
					}}</text>></view>
				</view>
				<!-- 总计 -->
				<view class="zongji_box">
					<view class="zongjia_box">总计</view>
					<view class="zongji_money_box">￥{{ fullName }}</view>
				</view>
				<view class="zongji_box">
					<view class="zongjia_box">跳过动画</view>
					<view class="switch_box">
						<u-switch v-model="switchVal" @change="change" activeColor="#FFB02E"
							inactiveColor="#EAEAEA"></u-switch>
					</view>
				</view>
				<!-- 点击开箱 -->
				<view class="kaixiang_box" @click="openbox">
					点击开箱
				</view>
				<view class="unpacking_box" v-if="unpacking == true">本次开箱奖励翻倍</view>
				<view class="tab_xieyi" @tap="goCheck">
					<image :src="iconurl + '/static/index/pzselect3.png'" v-if="xieyiStu == false"></image>
					<image :src="iconurl + '/static/index/pzselect4.png'" v-else></image>
					<view class="" style="color: white; height: 100rpx; line-height: 100rpx;">已阅读并同意
						<text style="color: #FF5F5F;" @click.stop="goUrl('/userPage/user/agreement?id=2')">《用户协议》</text>
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 优惠弹窗 -->
		<uni-popup ref="youhuiquanPopup" type="bottom" :mask-click="false" @touchmove.stop.prevent="moveHandle">

			<view class="cld">
				<!-- 支付顶部 -->
				<view class="zf_top_box">
					<view class="fanhuibtn_box" @tap="yhfanhui">
						<image src="https://new.qingfentool.vip/upload/image/20230610/d20b8c0eaf5de5f1e788a8da5eb43e8e.png"
							mode=""></image>
					</view>
					<view class="shangpin_txt">
						优惠券
					</view>
				</view>
				<!-- 优惠内容-->
				<view class="content_box" style="color: white;">
					<template v-if="yhList.length > 0">
						<scroll-view scroll-y class="yh_box" enhanced :show-scrollbar="false">
							<view class="dangeyh_box" v-for="( item, index ) in  yhList " :key="index" @click="yhBtn(item)">
								<view class="zhezhao_box" v-if="item.checked == false"></view>
								<view class="left_box">
									<view class="top_txt">
										<text class="mon_box">￥</text><text class="num_box">{{ item.sub_price }}</text>
									</view>
									<view class="bot_txt">
										<text v-if="item.min_price > 0">满{{ item.min_price }}元可用</text>
										<text v-else>{{ item.min_price_desc }}</text>
									</view>
								</view>
								<view class="right_box">
									<view class="top_txt_box">{{ item.name }}</view>
									<view class="bot_txt_box">使用日期：{{ item.begin_time }}—{{ item.end_time }}</view>
								</view>
							</view>
						</scroll-view>
						<view class="querenyhq_box" @click="syYhq">确定</view>
					</template>
					<template v-else>
						<view class="wuyh_box" style="width: 100%;height: 1120rpx;">
							<view style="    width: 65%;height: 41%; margin: auto; position: relative;">
								<image style="width: 100%; height: 100%;"
									src="https://mh.qingfentool.vip/upload/image/20230522/f4531b9efda28541e8c811554ed10626.png"
									mode=""></image>
							</view>
						</view>
					</template>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="doublePopup" type="bottom" :mask-click="false" @touchmove.stop.prevent="moveHandle">

			<view class="double_big_box">
				<!-- 加倍顶部 -->
				<view class="double_top_box">
					<view class="fanhuibtn1_box" @tap="doubleClose">
						<image src="https://new.qingfentool.vip/upload/image/20230610/d20b8c0eaf5de5f1e788a8da5eb43e8e.png"
							mode=""></image>
					</view>
					<view class="shangpin1_txt">
						加倍令
					</view>
				</view>
				<!-- 加倍卡内容-->
				<view class="content_box" style="color: white;">
					<template>
						<scroll-view v-if="doubleList.length > 0" scroll-y class="jiabei_box" enhanced
							:show-scrollbar="false">
							<view class="double_dg_box" v-for="(item, index) in doubleList" :key="index">
								<view class="shiyong_box" @click="weapDouble(item)">确定使用</view>
								<view class="double_txt_box">加倍令可用于199价格以下的盲盒使用</view>
							</view>

						</scroll-view>
						<view v-else class="double_kong_box">
						</view>
					</template>
				</view>
			</view>
		</uni-popup>
		<!-- 霸主 -->
		<uni-popup ref="lingzhuPopup" type="bottom" :mask-click="false">
			<view class="lingzhu_big_box">
				<view class="guabibangdan">
					<view style=" width: 44rpx; height: 44rpx;float: right;margin-right: 50rpx;margin-top: 30rpx;">
						<image @tap="guanbilingzhu" style=";width: 100%;height: 100%;"
							src="https://mh.qingfentool.vip/upload/image/20230221/638f634a533ff640b6b3b667dde38995.png"
							mode=""></image>
					</view>
				</view>
				<view class="lingzhu_box">
					<view class="lingzhu_top_box" @click="goUrl(`/userPage/user/agreement?id=${play}`)">
						玩法
						<view style="padding: 6rpx 0 0 10rpx;">
							<image
								src="https://mh.qingfentool.vip/upload/image/20230221/4e7beab8c64f4a618e1a8c055536e25e.png"
								mode=""></image>
						</view>
					</view>
					<view class="bangling_box">
						<view class="bangdan_box" @tap="bangdandianzhiqian">
							<image v-show="bangdanqian" style="position: absolute; width: 100%;height: 100%;"
								src="https://mh.qingfentool.vip/upload/image/20230523/bc63f841d59f6e00656e59639ef4749f.png"
								mode=""></image>
							<image v-show="bangdanhou" style="position : absolute; width: 100%;height: 100%;"
								src="https://mh.qingfentool.vip/upload/image/20230523/32efea96bedceb74d54bd0e479cd71c3.png"
								mode=""></image>
						</view>
						<view class="zhanji_box" @tap="zhanjidianzhiqian">
							<image v-show="zhanjiqian" style="position: absolute; width: 100%;height: 100%;"
								src="https://mh.qingfentool.vip/upload/image/20230523/a0318c410ec6f027eba166d35f514e44.png"
								mode=""></image>
							<image v-show="zhanjihou" style=" position: absolute;width: 100%;height: 100%;"
								src="https://mh.qingfentool.vip/upload/image/20230523/261d71c24c687692569d5cac201d179a.png"
								mode=""></image>

						</view>

					</view>
					<view class="bangdan_content_box" v-show="bangdanCon">
						<view class="bangdan_top_box">
							<view class="bangdan_top_txt">
								排名
							</view>
							<view class="bangdan_top_txt">
								用户
							</view>
							<view class="bangdan_top_txt">
								霸主收益
							</view>
						</view>
						<scroll-view scroll-y="true" class="connten_box" :show-scrollbar="false" enhanced>
							<view class="conent_box" v-for="( item, index ) in  feudalList " :key="index">
								<view v-if="index + 1 == 1" class="paiming_box">
									<image
										src="https://mh.qingfentool.vip/upload/image/20230222/deaa0103dc3e4471bcb227efb2d17282.png"
										mode=""></image>
								</view>
								<view v-if="index + 1 == 2" class="paiming_box">
									<image
										src="https://mh.qingfentool.vip/upload/image/20230222/ed86129024509a3e2e2ed45ce1e193cf.png"
										mode=""></image>
								</view>
								<view v-if="index + 1 == 3" class="paiming_box">
									<image
										src="https://mh.qingfentool.vip/upload/image/20230222/290c58218773ede09b63ff7d635333bc.png"
										mode=""></image>
								</view>
								<view v-if="index + 1 > 3" class="paiming_box">
									{{ index + 1 }}
								</view>
								<view class="ueser_box">
									<view class="user_pic">

										<view class="user_xk_bg_box" style="width: 90rpx;height: 90rpx;">
											<image style="width: 100%;height: 100%;border-radius: 50%;" :src="item.avatar"
												mode=""></image>
										</view>
										<view class="user_xk_bg_box" style="width: 120rpx;height: 120rpx;">
											<image style="width: 100%;height: 100%;border-radius: 50%;"
												:src="item.frameless_head" mode=""></image>
										</view>

									</view>
									<view class="user_txt">
										<view class="user_txt_one">
											{{ item.nick_name }}
										</view>
										<view class="user_txt_two">
											累计占榜<text style="color: #74ECFF;">{{ item.minutes }}分钟</text>
										</view>
									</view>
								</view>
								<view class="longzhu_box">
									{{ item.integral }}大王币
								</view>
							</view>
						</scroll-view>
					</view>
					<!-- 战绩内容 -->
					<view class="bangdan_content_box" color="white">
						<view class="zhanji_top_box">

							<view class="zhanji_topL_box">
								<view class="lingzhu_pep">
									<image
										src="https://mh.qingfentool.vip/upload/image/20230529/9144b93e3be16b92772ca61eb479a510.png"
										mode=""></image>
								</view>
								<view class="user_pic">

									<view class="user_xk_bg_box" style="
												width: 75rpx;
												height: 75rpx;">
										<image style="width: 100%;height: 100%;border-radius: 50%;" :src="recordlObj.avatar"
											mode=""></image>
									</view>
									<view class="user_xk_bg_box" style="
												width: 120rpx;
												height: 120rpx;">
										<image style="width: 100%;height: 100%;border-radius: 50%;"
											:src="recordlObj.frameless_head" mode=""></image>
									</view>
								</view>
								<view class="user_txt">
									<view class="user_txt_one">
										{{ recordlObj.nick_name }}
									</view>
									<view class="user_txt_two">
										累计占榜<text style="color: #74ECFF;">{{ recordlObj.minutes }}分钟</text>
									</view>
								</view>
							</view>
							<view class="zhanji_topR_box">
								{{ recordlObj.reward }}大王币
							</view>
						</view>



						<view class="tiaozhanNum">
							已有<text style="color: #5ABAFF;">{{ zhanbangCount }}</text>人向霸主挑战
						</view>

						<!-- 内容区 -->
						<view class="zhanji_con" v-for="( item, index ) in  recordList " :key="index">
							<view class="zhanji_con_txt">
								<view class="zhanji_shangpin_box">
									恭喜{{ item.nickname }}开出了<text style="color: FFD98E;">{{ item.prize_level +
										'款' }}</text>{{ item.prize_name }}
								</view>
								<view class="zhanji_time_box">
									{{ item.create_time | formatDate('-') }}
								</view>
							</view>
							<view class="zhanji_con_pic">
								<image :src="item.prize_icon" mode=""></image>
							</view>
							<view class="zhanji_con_lz">
								NO:{{ item.id }}
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>
<script>
import progressbar from '../../components/progressbar/index.vue'
export default {
	components: {
		progressbar
	},
	data() {
		return {
			upOpenStatus: false,//底部状态
			switchVal: uni.getStorageSync('switchVal'),//动画开关
			indicatorDots: false,
			autoplay: true,
			interval: 3000,
			duration: 1000,
			xqObj: {//详情对象
				cover_pic: '',//顶部动图
				name: '',//盒子名称
				price: '',//单发价格
				three_price: '',//三发价格
				five_price: '',//五法价格
				multiple: '',//盒子倍数
				reset_day: '',//倒计时
			},
			jibieList: [],//等级list
			realNum: 1,//步进器当前的值
			fifterList: [],//商品列表
			Lord: {
				minutes: '',
				reward: '',
				nick_name: '',

			},//详情对象
			zjOpenBtnList: [//最近开出状态按钮
				{
					type: 0,
					text: "全部"
				},
				{
					type: 1,
					text: "稀有"
				},
				{
					type: 2,
					text: "将军"
				},
				{
					type: 3,
					text: "大王"
				},
			],
			recentChecked: 0,//最近开出状态按钮(默认：全部：0)
			recentList: [],//最近开出列表
			shishiKc: '',//距离上次多少份
			recentPage: 1,//最近开出分页
			flag: true, // 分页防抖开关 防止用户不停的下拉
			scrollTop: 0, // 滚动条位置，距顶为0
			oldScrollTop: 0,
			shenhuaList: [],// 神话list
			chuanshuoList: [],// 传说list
			xiyouList: [],// 稀有list
			putongList: [],// 普通list
			boxType: '',//盒子类型0:盲盒1：倍赏2：有限池
			play: '',//玩法类型
			boxId: '',//盒子id
			detailObj: {//详情对象
				price: '',
				title: ''
			},
			detailPicList: [],//详情页list
			goods_introduce: '',//详情富文本替换后样式
			iconurl: this.$configs.urls,
			xieyiStu: false,//协议
			yhList: '',//优惠券列表
			chouPrice: "",//总支付num
			recordList: [], //战绩列表
			zhanbangCount: '', //占榜人数
			recordlObj: [], //战绩对象
			feudalList: [], //霸主List
			bangdanCon: true,// 榜单盒子
			bangdanqian: true,// 榜单盒子
			bangdanhou: true,// 榜单盒子
			zhanjiqian: true,// 榜单盒子
			zhanjihou: false,// 榜单盒子
			shenhuagv: '',//神话概率
			chuanshuogv: '',//传说概率
			xiyougv: '',//稀有概率
			putonggv: '',//普通概率
			couponValue: 0,//选择优惠券价值
			yhqNum: 0,// 确认选择的优惠券
			user_coupon_id: 0,//优惠券id
			select_id: 0,//选中的优惠券id
			yueNum: 0,//余额
			seen: false,//钱包
			zongNum: '',//总抽数
			shengyuNum: '',//剩余抽数
			rageTotal: '',//怒气总值
			rageValue: '',//怒气当前值
			speedNnum: '',//怒气卡数量
			powerValue: '',//怒气百分比
			doubleList: '',//加倍卡列表
			showSpeed: '',//是否显示加倍卡
			speedCardId: '',//加倍卡id
			unpacking: '',//是否显示开箱加倍
		}
	},
	onLoad(options) {
		this.boxId = options.box_id//盒子类型1:盲盒2：倍赏3：有限池
		this.boxType = options.box_type

	},
	onHide() {
		this.unpacking = false
	},
	onShow() {
		this.getObj()// 详情
		this.arrData()//余额查询
		if (uni.getStorageSync('open') == 1) {
			this.recentPage = 1
			this.recentList = []
			this.zuijinBtn()
			uni.setStorageSync('open', 0)
		}
		this.switchVal = uni.getStorageSync('switchVal') ? uni.getStorageSync('switchVal') : false
	},
	filters: {
		// 时间戳处理
		formatDate: function (value, spe = '/') {
			value = value * 1000
			let data = new Date(value);
			let year = data.getFullYear();
			let month = data.getMonth() + 1;
			let day = data.getDate();
			let h = data.getHours();
			let mm = data.getMinutes();
			month = month >= 10 ? month : "0" + month;
			day = day >= 10 ? day : "0" + day;
			h = h >= 10 ? h : "0" + h;
			mm = mm >= 10 ? mm : "0" + mm;
			return `${year}${spe}${month}${spe}${day} ${h}:${mm}`;
		}
	},
	computed: {
		fullName() {
			return (Number(this.chouPrice) - Number(this.yhqNum)).toFixed(2) > 0 ? (Number(this.chouPrice) - Number(this.yhqNum)).toFixed(2) : 0
		}
	},
	methods: {
		// 加倍规则
		ruleDouble() {
			uni.navigateTo({
				url: '/userPage/user/agreement?id=' + 24
			});
		},
		// 关闭加倍卡弹窗
		doubleClose() {
			this.$refs.doublePopup.close()
		},
		// 点击加倍卡（打开加倍卡弹窗）
		doubleBtn() {
			let data = {
				status: 1
			}
			this.$Request.get(this.$api.user.getSpeedCard, data).then(res => {

				this.$refs.doublePopup.open()
				this.doubleList = res.data
			})
		},
		weapDouble(item) {
			this.speedCardId = item.id
			this.$refs.doublePopup.close()
			this.unpacking = true
		},
		scroll(e) {
			//记录scroll 位置
			this.oldScrollTop = e.detail.scrollTop
		},
		// 最近开出触底加载
		quanbuLower() {
			if (this.flag) {
				this.zuijinBtn()
			} else {
				uni.showToast({
					title: "没有更多了",
					icon: 'none'
				})
			}

		},
		// 关闭最近开出
		departure() {
			this.upOpenStatus = false

			this.recentPage = 1
		},
		//最近开出状态按钮
		openType(item) {
			this.scrollTop = this.oldScrollTop
			this.$nextTick(() => {
				this.scrollTop = 0
			});
			this.recentChecked = item.type
			this.recentPage = 1
			this.recentList = []
			this.zuijinBtn()
		},
		// 倒计时结束
		endTime() {
			setTimeout(() => {
				this.xqObj.reset_day = 0
				this.getObj()
				this.$refs.uCountDown.start();
			}, 1000)
		},
		// 跳过动画
		change(switchVal) {
			uni.setStorageSync('switchVal', switchVal)
		},
		// 点击眼睛
		dianjiyanjing() {
			this.seen = !this.seen
		},
		// 余额
		arrData() {
			this.$Request.get(this.$api.user.index).then(res => {
				if (res.code == 406) {
					this.yueShow = false
				} else {
					this.yueShow = true
					this.yueNum = res.data.userInfo.integral
					this.rageTotal = res.data.userInfo.rage_total
					this.rageValue = res.data.userInfo.rage_value
					this.speedNnum = res.data.userInfo.speed_num
					this.powerValue = (this.rageValue / this.rageTotal) * 100
					console.log(this.powerValue)

				}
			});
		},
		// 确定使用优惠卷
		syYhq() {
			this.$refs.youhuiquanPopup.close()
			this.yhqNum = this.couponValue
			if (!this.select_id) {
				this.yhqNum = 0
				this.user_coupon_id = 0
			}
			this.user_coupon_id = this.select_id

		},
		// 选择优惠券
		yhBtn(item) {
			this.select_id = item.checked ? 0 : item.user_coupon_id
			this.yhList.forEach((val) => {
				val.checked = item.user_coupon_id == val.user_coupon_id ? !val.checked : false
			})
			this.couponValue = item.sub_price


		},
		// 一发
		oneBtn() {
			this.tabIndex = 1
			this.$refs.popup.open('bottom')
			this.chouPrice = (this.realNum * this.xqObj.price).toFixed(2)
			this.xieyiStu = false
		},
		// 三发
		threeBtn() {
			this.tabIndex = 2
			this.$refs.popup.open('bottom')
			this.chouPrice = (this.realNum * this.xqObj.three_price).toFixed(2)
			this.xieyiStu = false
		},
		// 五发
		fiveBtn() {
			this.tabIndex = 3
			this.$refs.popup.open('bottom')
			this.chouPrice = (this.realNum * this.xqObj.five_price).toFixed(2)
			this.xieyiStu = false
		},
		tenBtn() {
			this.tabIndex = 4
			this.$refs.popup.open('bottom')
			this.chouPrice = (this.realNum * this.xqObj.ten_price).toFixed(2)
			this.xieyiStu = false
		},
		// 同意协议
		goCheck() {
			this.xieyiStu = !this.xieyiStu;
		},
		// 点击开箱
		openbox() {
			this.$u.throttle(() => {
				if (this.xieyiStu == false) {
					uni.showToast({
						title: '请阅读并同意用户协议',
						icon: 'none'
					});
					return
				}
				let data = {
					box_id: this.boxId,
					pay_mode: this.tabIndex,
					pay_type: 3,
					speed_card_id: this.speedCardId,
					multiple: this.realNum,
					user_coupon_id: this.user_coupon_id,
					invite_code: uni.getStorageSync('invite_code'),
					idef: uni.getStorageSync('idef')
				};
				let init = {
					integral: 1
				}
				this.$Request.get(this.$api.user.index, init).then(res => {
					let arrNum = Number(res.data.integral)
					let yueNum = Number(this.fullName)
					if (arrNum >= yueNum) {
						if (!this.switchVal) {
							uni.navigateTo({//true
								url: '/orderPage/index/lucksuc?box_id=' + this.boxId + '&num=' + this.type + '&boxType=' + this.boxType + '&tenOpen=' + data.pay_mode + '&data= ' + JSON.stringify(
									data)
							})
						} else {
							uni.navigateTo({//false
								url: '/orderPage/index/Starcraft?box_id=' + this.boxId + '&num=' + this.type + '&boxType=' + this.boxType + '&tenOpen=' + data.pay_mode + '&data= ' + JSON.stringify(
									data)
							})
						}
					} else {
						let rechargeNum = yueNum - arrNum
						uni.navigateTo({
							url: '/userPage/user/balance?heji_num=' + rechargeNum + '&fromPage= 1' +
								'&tabIndex=' + data.pay_type + '&box_id=' + this.boxId + '&data= ' + JSON.stringify(
									data)
						});
					}
				})
				// e.tabIndex = this.tabIndex
				// let data = {
				// 	box_id: this.boxId,
				// 	pay_mode: this.tabIndex,
				// 	pay_type: 3,
				// 	speed_card_id: this.speedCardId,
				// 	multiple: this.realNum,
				// 	user_coupon_id: this.user_coupon_id,
				// 	invite_code: uni.getStorageSync('invite_code'),
				// 	idef: uni.getStorageSync('idef')
				// };
				// let num = this.tabIndex
				// this.$Request.post(this.$api.mhapi.newSubmit, data).then(res => {
				// 	let status = res.data.status
				// 	this.unpacking = false
				// 	this.yhqNum = 0
				// 	this.user_coupon_id = 0
				// 	this.select_id = 0
				// 	this.couponValue = 0
				// 	uni.setStorageSync('cabShuaxin', 1)
				// 	uni.setStorageSync('open', 1)
				// 	if (res.data.is_prohibit_pay == 1) {
				// 		uni.navigateTo({
				// 			url: '/userPage/user/balance?heji_num=' + res.data.paidou + '&fromPage= 1' +
				// 				'&tabIndex=' + num + '&box_id=' + this.boxId + '&data= ' + JSON.stringify(
				// 					data)
				// 		});
				// 		return;
				// 	}
				// 	if (status == 0) {
				// 		this.payurl = res.data.pay_data;
				// 		this.order_id = res.data.order_id;
				// 		//微信或支付宝支付
				// 		this.payPrice(res.data.pay_data, res.data.order_id);
				// 	} else if (status == 1) {
				// if (!this.switchVal) {
				// 	uni.navigateTo({//true
				// 		url: '/orderPage/index/lucksuc?box_id=' + this.boxId + '&order_id=' + res
				// 			.data.order_id + '&num=' + this.type + '&boxType=' + this.boxType + '&tenOpen=' + data.pay_mode
				// 	})
				// }
				// else {
				// 	uni.navigateTo({//false
				// 		url: '/orderPage/index/Starcraft?box_id=' + this.boxId + '&order_id=' + res
				// 			.data.order_id + '&num=' + this.type + '&boxType=' + this.boxType + '&tenOpen=' + data.pay_mode
				// 	})
				// }
				// 	}
				// });
			}, 2000)
		},
		// 关闭支付弹窗
		zftkgb() {
			this.jishuNum = 1
			this.yhqNum = 0
			this.select_id = 0
			this.user_coupon_id = 0
			this.onetake = this.xqObj.price
			this.$refs.popup.close()
		},
		// 选择优惠券
		youhuiopen() {
			uni.showLoading({
				title: '加载中'
			});
			this.$refs.youhuiquanPopup.open('bottom')
			let data = {
				box_id: this.boxId,
				type: this.tabIndex
			}
			this.$Request.get(this.$api.user.boxCouponList, data).then(res => {
				uni.hideLoading();
				res.data.forEach(item => {

					item.checked = this.user_coupon_id == item.user_coupon_id ? true : false
				});
				this.yhList = res.data
			})

		},
		// 关闭优惠券弹窗
		yhfanhui() {
			this.$refs.youhuiquanPopup.close()
		},
		// 点击榜单
		bangdandianzhiqian() {
			this.bangdanhou = true
			this.zhanjihou = false
			this.bangdanCon = true
		},
		zhanjidianzhiqian() {
			this.bangdanhou = false
			this.zhanjihou = true
			this.bangdanCon = false
			let data1 = {
				box_id: this.boxId,
			}
			// ////console.log(data1)
			this.$Request.get(this.$api.mhapi.getOwnerRecord, data1).then(res => {
				this.recordlObj = res.data.owner
				this.zhanbangCount = res.data.counter
				this.recordList = res.data.record
			})
		},
		// 点击霸主
		lingzhuopen() {
			this.$refs.lingzhuPopup.open('bottom')
			let data = {
				box_id: this.boxId
			}
			this.$Request.get(this.$api.mhapi.getOwnerList, data).then(res => {
				// ////console.log(res.data, "榜单");
				this.feudalList = res.data
			})

		},
		// 关闭霸主
		guanbilingzhu() {
			this.$refs.lingzhuPopup.close()
		},
		changeValue(value) {
			this.realNum = value
			console.log(this.realNum)
			if (value >= Number(this.xqObj.multiple)) {
				uni.showToast({
					title: this.xqObj.multiple + "已是最大倍数",
					icon: 'none'
				})
			}
		},
		blurValue(value) {
			console.log(this.xqObj.multiple)
			if (value >= Number(this.xqObj.multiple)) {
				uni.showToast({
					title: this.xqObj.multiple + "已是最大倍数",
					icon: 'none'
				})
			}
		},
		// 商品详情
		shopDeatilBtn(item) {
			this.$refs.shopDetilPopup.open()
			let data = {
				goods_id: item.goods_id
			}
			this.$Request.get(this.$api.mall.detail, data).then(res => {
				console.log(res)
				this.detailObj = res.data.goods
				this.goods_introduce = this.detailObj.detail.replace(/<img/g, '<img style="max-width:100%;z-index:1;"')
				let list = res.data.goods.big_pics
				list.forEach(item => {
					let shopObj = [{
						image: item
					}]
					this.detailPicList = shopObj
				})
			})
		},
		// 关闭商品详情
		guanbixiangqing() {
			this.$refs.shopDetilPopup.close()
		},
		// 最近开出
		zuijinBtn() {
			let data = {
				box_id: this.boxId,
				type: this.recentChecked,
				page: this.recentPage
			}
			this.$Request.get(this.$api.index.bulletchat, data).then(res => {
				this.upOpenStatus = true
				this.shishiKc = res.data.lastCount//距离上次多少份
				this.recentList = res.data.list;
				// this.recentPage++
				// this.recentList = this.recentList.concat(recentList);// 拼接回来的数据
				// // 当回来的数据小于十条得时候 不让再请求了 否则继续请求
				// if (recentList.length < 10) {
				// 	this.flag = false
				// } else {
				// 	this.flag = true
				// }

			})
			// uni.navigateTo({
			// 	url: '/rollPages/index/zuijinopen?box_type=' + this.boxType + '&box_id=' + this.boxId
			// })
		},
		// 玩法
		wanfaBtn() {
			uni.navigateTo({
				url: '/userPage/user/agreement?id=' + this.play
			});
		},
		// 返回
		fanhui() {
			uni.navigateBack();
		},
		// 玩法
		goUrl(url) {
			uni.navigateTo({
				url: url
			});
		},
		// 客服
		enterkefu() {
			uni.navigateTo({
				url: '/orderPage/index/webkefuview'
			});
		},
		// 详情
		getObj() {
			this.shenhuaList = []// 神话list
			this.chuanshuoList = []// 神话list
			this.xiyouList = []// 神话list
			this.putongList = []// 神话list
			let data = {
				box_id: this.boxId
			}
			this.$Request.get(this.$api.mhapi.getCurrentOwner, data).then(res => {
				// ////console.log(res.data, "霸主");
				this.Lord = res.data
			})
			this.$Request.get(this.$api.mhapi.index, data).then(res => {
				this.showSpeed = res.data.box.show_speed
				this.xqObj = res.data.box//详情对象
				this.boxType = res.data.box.cat_id//盒子id
				this.zongNum = res.data.box_total_num// 总抽数
				this.shengyuNum = res.data.box_current_num// 剩余总抽数
				if (this.boxType == 0) {
					this.play = 6//玩法类型
				} else if (this.boxType == 1) {
					this.play = 8//玩法类型
				} else if (this.boxType == 2) {
					this.play = 20//玩法类型
				}



				// this.zsxConten = res.data.high_level_count//至尊款/史诗款/稀有款数量
				this.jibieList = res.data.level_list//级别列表

				// 神话
				this.shenhuagv = this.jibieList[0].probability
				this.chuanshuogv = this.jibieList[1].probability
				this.xiyougv = this.jibieList[2].probability
				this.putonggv = this.jibieList[3].probability
				this.fifterList = res.data.prize_list// 内容列表
				this.fifterList.forEach((item, index) => {
					if (item.level == 3) {
						this.shenhuaList.push(item)
					} else if (item.level == 2) {
						this.chuanshuoList.push(item)
					} else if (item.level == 1) {
						this.xiyouList.push(item)
					} else if (item.level == 0) {
						this.putongList.push(item)
					}
				})
			})
		},
	}
}
</script>
<style lang="scss" scoped>
/deep/.uni-numbox__value {
	height: 80rpx !important;
	line-height: 80rpx !important;
}

.page {
	width: 100vw;
	min-height: 100vh;
	background-image: url('https://new.qingfentool.vip/upload/image/20230703/4922bff327b2209508e1ae3b6bc218c4.png');
	background-size: 100% 100%;

	.header_box {
		width: 100%;
		height: 226rpx;
		position: relative;
		margin-bottom: 26rpx;

		.nav_box {
			width: 100%;
			height: 134rpx;
			position: absolute;
			bottom: 0;
			display: flex;
			justify-content: space-between;
			padding-right: 15rpx;

			.left_box {
				width: 70rpx;
				height: 100%;
				position: relative;

				.fanhui_box {
					width: 30rpx;
					height: 50rpx;
					opacity: 1;
					position: absolute;
					left: 0;
					right: 0;
					top: 0;
					bottom: 0;
					margin: auto;
				}
			}

			.middle_box {
				width: 397rpx;
				height: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding-left: 28rpx;
				padding-right: 10rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230515/1c986e6f1bdcd3f917f3d069dd394307.png');
				background-size: 100% 100%;

				.mid_left_box {
					width: 70rpx;
					height: 70rpx;
					opacity: 1;
					border-radius: 50%;

					image {
						width: 100%;
						height: 100%;
						border-radius: 50%;
					}
				}

				.mid_right_box {
					width: 277rpx;
					height: 67%;

					.mid_right_top_txt {
						width: 100%;
						height: 36rpx;
						line-height: 36rpx;
						font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
						font-weight: 400;
						color: #FFF1B7;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						margin-bottom: 20rpx;
					}

					.mid_right_bot_txt {
						width: 100%;
						height: 24rpx;
						font-size: 16rpx;
						font-weight: 400;
						color: #FFC400;
						line-height: 24rpx;
					}
				}
			}

			.yxcSty {
				width: 312rpx;
				height: 138rpx;
				background-image: url('https://new.qingfentool.vip/upload/image/20230610/8ce49e7f57759a7b0540e2543fc6f235.png');
				background-size: 100% 100%;
				padding-top: 48rpx;

				.yxc_name_box {
					width: 100%;
					height: 38rpx;
					font-size: 32rpx;
					font-family: HelloFont ID JiangHuTi-Regular, HelloFont ID JiangHuTi;
					font-weight: 400;
					color: #A40000;
					line-height: 38rpx;
					text-align: center;
					font-family: Alimama_DongFangDaKai_Regular;
				}

				.djs_box {
					width: 100%;
					height: 46rpx;
					font-size: 44rpx;
					font-family: HelloFont ID JiangHuTi-Regular, HelloFont ID JiangHuTi;
					font-weight: 400;
					color: #A40000;
					line-height: 37rpx;
					text-align: center;
					font-family: Alimama_DongFangDaKai_Regular;
				}
			}

			.right_box {
				width: 70rpx;
				height: 100%;
				position: relative;

				.kefu_box {
					width: 60rpx;
					height: 50rpx;
					position: absolute;
					left: 0;
					right: 0;
					margin: auto;
					bottom: -17rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}

	.swiper_big_box {
		width: 100%;
		height: 492rpx;
		margin-bottom: 6rpx;

		.uni-margin-wrap {
			width: 100%;
			height: 100%;

			.swiper {
				width: 100%;
				height: 492rpx;

				.swiper-item {
					width: 344rpx;
					display: block;
					height: 100%;
					// background-image: url('https://mh.qingfentool.vip/upload/image/20230515/01416ae231eb8b0ecb22cec5fe1d13bb.png');
					// background-size: 100% 100%;
					padding-top: 96rpx;

					.swiper_pic_box {
						width: 216rpx;
						// height: 216rpx;
						margin: auto;

						image {
							width: 100%;
							// height: 100%;
						}

					}



					.swiper_name_box {
						width: 212rpx;
						height: 32rpx;
						font-size: 26rpx;
						font-family: Source Han Sans CN-Bold, Source Han Sans CN;
						font-weight: 700;
						color: #FFFFFF;
						line-height: 32rpx;
						text-align: center;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						margin: auto;
						margin-top: 95rpx;
					}

					.swiper_prc_box {
						width: 100%;
						height: 45rpx;
						line-height: 45rpx;
						font-size: 26rpx;
						font-family: Source Han Sans CN-Bold, Source Han Sans CN;
						font-weight: 700;
						color: #FFFFFF;
						text-align: center;
						margin-bottom: 16px;
					}

				}
			}
		}

	}

	.weichengnian_box {
		width: 100%;
		text-align: center;
		height: 32rpx;
		font-size: 22rpx;
		font-family: Source Han Sans CN-Medium, Source Han Sans CN;
		font-weight: 500;
		color: #fff;
		line-height: 32rpx;
		margin: auto;
		margin-bottom: 6rpx;
	}

	.bujinqi_box {
		width: 100%;
		height: 88rpx;
		position: relative;

		.money_box {
			width: 200rpx;
			height: 80rpx;
			position: absolute;
			left: 0;
			display: flex;
			justify-content: flex-start;
			align-items: center;

			.yanjing {
				width: 70rpx;
				height: 74rpx;
				margin-left: 20rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}

		// background-color: aqua;
		.num_txt_box {
			width: 480rpx;
			height: 100%;
			margin: auto;
			display: flex;
			justify-content: flex-end;
			align-items: center;

			.shengyu_chou_box {
				width: 370rpx;
				height: 52rpx;
				background: rgba(255, 231, 192, 0.1);
				border-radius: 14rpx 14rpx 14rpx 14rpx;
				opacity: 1;
				border: 1rpx solid #FED187;
				text-align: center;
				line-height: 52rpx;
				margin-right: 65rpx;
				font-size: 30rpx;
				font-family: Alimama_DongFangDaKai_Regular;
				font-weight: 400;
				color: #FFB02E;
			}

			.num_box {
				width: 276rpx;
				height: 100%;
				margin: auto;

				/deep/.uni-numbox {
					width: 450rpx;
				}

				/deep/.uni-numbox--text {
					opacity: 0;
				}

				/deep/.uni-numbox__minus {
					background-image: url('https://mh.qingfentool.vip/upload/image/20230516/05adbb7ec679d7303571ae5aa582f535.png');
					background-size: 100% 100%;
				}

				/deep/.uni-numbox__plus {
					background-image: url('https://mh.qingfentool.vip/upload/image/20230516/89b4825ce5cede8a934660232aa2177f.png');
					background-size: 100% 100%;
				}

			}

			.text_box {
				width: 98rpx;
				height: 46rpx;
				font-size: 32rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFC400;
				line-height: 46rpx;
			}
		}

		.wanfa_box {
			position: absolute;
			width: 92rpx;
			height: 52rpx;
			border-radius: 0rpx 0rpx 0rpx 0rpx;
			opacity: 1;
			right: 0;
			top: 50%;
			transform: translate(0, -50%);
			text-align: center;
			line-height: 52rpx;
			color: #FFC400;
			border-radius: 36rpx 0rpx 0rpx 36rpx;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/4003e58c4ae576aa89fc3480f2ac53a9.png');
			background-size: 100% 100%;
		}

		.zuijinkaichu {
			width: 202rpx;
			height: 64rpx;
			text-align: center;
			line-height: 64rpx;
			font-size: 28rpx;
			font-weight: 700;
			color: #690000;
			float: right;
			margin-right: 28rpx;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/02ee79a6f4e28c6e1cf097e778b011a7.png');
			background-size: 100% 100%;
		}

	}

	// 神话
	.shenhua_box {
		width: 100%;
		height: 328rpx;
		// background-color: skyblue;

		.box_title {
			width: 500rpx;
			height: 98rpx;
			// background-color: #fff;
			display: flex;
			justify-content: flex-start;
			padding-left: 10rpx;

			.title_pic_box {
				width: 98rpx;
				height: 98rpx;

				image {
					width: 100%;
					height: 100%;
					// animation: rotate 3s linear infinite;
				}

				@keyframes rotate {
					0% {
						transform: rotateY(0deg);
					}

					100% {
						transform: rotateY(360deg);
					}
				}
			}

			.title_dj_box {

				width: 120rpx;
				height: 98rpx;
				line-height: 120rpx;
				font-size: 40rpx;
				font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
				font-weight: 400;
				line-height: 130rpx;
				background: linear-gradient(180deg, #FFFFFF 0%, #FFC917 100%);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				margin: 0 8rpx;
			}

			.title_gv_box {
				width: 222rpx;
				height: 98rpx;
				font-size: 20rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 140rpx;
			}

		}

		.dj_list_box {
			width: 100%;
			height: 228rpx;
			// background-color: #fff;
			background-size: 100% 100%;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/db110ad08fa6723f2c0df0805394a775.png');
			position: relative;

			.dan_big_box {
				width: 144rpx;
				height: 196rpx;
				position: absolute;
				top: 18rpx;
				padding-left: 20rpx;
				display: flex;
				justify-content: flex-start;
				align-items: center;
				// background-color: #fff;

				.dan_box {
					width: 144rpx;
					height: 196rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230703/83bd6098f3af1f24c16827c1b26e0032.png');
					background-size: 100% 100%;
					margin-right: 24rpx;

					.dan_pic_box {
						width: 148rpx;
						height: 141rpx;
						margin: auto;
						// margin-top: 28rpx;
						// margin-bottom: 10rpx;

						image {
							width: 100%;
							height: 100%;
							// animation: rotate 3s linear infinite;

							// @keyframes rotate {
							// 	0% {
							// 		transform: rotateY(0deg);
							// 	}

							// 	100% {
							// 		transform: rotateY(360deg);
							// 	}
							// }
						}
					}

					.dan_name_box {
						width: 124rpx;
						height: 24rpx;
						font-size: 16rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 24rpx;
						text-align: center;
						// padding: 0 10rpx;
						margin: auto;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
		}
	}

	// 传说
	.chuanshuo_box {
		width: 100%;
		height: 328rpx;

		.box_title {
			width: 500rpx;
			height: 98rpx;
			display: flex;
			justify-content: flex-start;
			padding-left: 10rpx;

			.title_pic_box {
				width: 98rpx;
				height: 98rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.title_dj_box {
				width: 120rpx;
				height: 98rpx;
				line-height: 120rpx;
				font-size: 40rpx;
				font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
				font-weight: 400;
				line-height: 130rpx;
				background: linear-gradient(180deg, #FFFFFF 0%, #CB0000 100%);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				margin: 0 8rpx;
			}

			.title_gv_box {
				width: 222rpx;
				height: 98rpx;
				font-size: 20rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 140rpx;
			}

		}

		.dj_list_box {
			width: 100%;
			height: 228rpx;
			// background-color: #fff;
			background-size: 100% 100%;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/db110ad08fa6723f2c0df0805394a775.png');
			position: relative;

			.dan_big_box {
				width: 100%;
				height: 196rpx;
				position: absolute;
				top: 18rpx;
				padding-left: 20rpx;
				display: flex;
				justify-content: flex-start;
				align-items: center;

				.dan_box {
					width: 144rpx;
					height: 196rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230703/4853c2511ce75a7a99f0a7c5acb77caa.png');
					background-size: 100% 100%;
					margin-right: 24rpx;

					.dan_pic_box {
						width: 148rpx;
						height: 141rpx;
						// background-color: #fff;
						margin: auto;
						// margin-top: 28rpx;
						// margin-bottom: 10rpx;

						image {
							width: 100%;
							height: 100%;
							// animation: rotate 3s linear infinite;

							// @keyframes rotate {
							// 	0% {
							// 		transform: rotateY(0deg);
							// 	}

							// 	100% {
							// 		transform: rotateY(360deg);
							// 	}
							// }
						}
					}

					.dan_name_box {
						width: 124rpx;
						height: 24rpx;
						font-size: 16rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 24rpx;
						text-align: center;
						margin: auto;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
		}
	}

	// 稀有
	.xiyou_box {
		width: 100%;
		height: 328rpx;

		.box_title {
			width: 500rpx;
			height: 98rpx;
			display: flex;
			justify-content: flex-start;
			padding-left: 10rpx;

			.title_pic_box {
				width: 98rpx;
				height: 98rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.title_dj_box {
				width: 80rpx;
				height: 98rpx;
				line-height: 120rpx;
				font-size: 40rpx;
				font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
				font-weight: 400;
				line-height: 130rpx;
				background: linear-gradient(180deg, #FFFFFF 0%, #008CFF 100%);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				margin: 0 8rpx;
			}

			.title_gv_box {
				width: 222rpx;
				height: 98rpx;
				font-size: 20rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 140rpx;
			}

		}

		.dj_list_box {
			width: 100%;
			height: 228rpx;
			// background-color: #fff;
			background-size: 100% 100%;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/db110ad08fa6723f2c0df0805394a775.png');
			position: relative;

			.dan_big_box {
				width: 100%;
				height: 196rpx;
				position: absolute;
				top: 18rpx;
				padding-left: 20rpx;
				display: flex;
				justify-content: flex-start;
				align-items: center;

				.dan_box {
					width: 144rpx;
					height: 196rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230703/6a5100c8d61f135801238280facdc982.png');
					background-size: 100% 100%;
					margin-right: 24rpx;

					.dan_pic_box {
						width: 148rpx;
						height: 141rpx;
						// background-color: #fff;
						margin: auto;
						// margin-top: 28rpx;
						// margin-bottom: 10rpx;

						image {
							width: 100%;
							height: 100%;
							// animation: rotate 3s linear infinite;

							// @keyframes rotate {
							// 	0% {
							// 		transform: rotateY(0deg);
							// 	}

							// 	100% {
							// 		transform: rotateY(360deg);
							// 	}
							// }
						}
					}

					.dan_name_box {
						width: 124rpx;
						height: 24rpx;
						font-size: 16rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 24rpx;
						text-align: center;
						margin: auto;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
		}
	}

	// 普通
	.putong_box {
		width: 100%;
		height: 328rpx;

		.box_title {
			width: 500rpx;
			height: 98rpx;
			display: flex;
			justify-content: flex-start;
			padding-left: 10rpx;

			.title_pic_box {
				width: 98rpx;
				height: 98rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.title_dj_box {
				width: 80rpx;
				height: 98rpx;
				line-height: 120rpx;
				font-size: 40rpx;
				font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
				font-weight: 400;
				line-height: 130rpx;
				background: linear-gradient(183deg, #FFFFFF 0%, #A1A1A1 100%);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				margin: 0 8rpx;
			}

			.title_gv_box {
				width: 222rpx;
				height: 98rpx;
				font-size: 20rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 140rpx;
			}

		}

		.dj_list_box {
			width: 100%;
			height: 228rpx;
			// background-color: #fff;
			background-size: 100% 100%;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230516/db110ad08fa6723f2c0df0805394a775.png');
			position: relative;

			.dan_big_box {
				width: 100%;
				height: 196rpx;
				position: absolute;
				top: 18rpx;
				padding-left: 20rpx;
				display: flex;
				justify-content: flex-start;
				align-items: center;

				.dan_box {
					width: 144rpx;
					height: 196rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230703/1b36550fc37c18a43238de61aebd54a1.png');
					background-size: 100% 100%;
					margin-right: 24rpx;

					.dan_pic_box {
						width: 148rpx;
						height: 141rpx;
						// background-color: #fff;
						margin: auto;
						// margin-top: 28rpx;
						// margin-bottom: 10rpx;

						image {
							width: 100%;
							height: 100%;
							// animation: rotate 3s linear infinite;

							// @keyframes rotate {
							// 	0% {
							// 		transform: rotateY(0deg);
							// 	}

							// 	100% {
							// 		transform: rotateY(360deg);
							// 	}
							// }
						}
					}

					.dan_name_box {
						width: 124rpx;
						height: 24rpx;
						font-size: 16rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 24rpx;
						text-align: center;
						margin: auto;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
		}
	}

	.zuijinOpen_box {
		width: 100%;
		height: calc(100vh - 1010rpx);
		// background-color: #fff;
		background-image: url('https://new.qingfentool.vip/upload/image/20230704/074e00765eaed289d87e15eb93998ce2.png');
		background-size: 100% 100%;
		position: relative;
		padding: 70rpx 0 0 0;

		.top_box {
			width: 100%;
			height: 70rpx;
			display: flex;
			position: absolute;
			top: 0;
			justify-content: space-between;
			align-items: center;

			.open_left_box {
				width: 90rpx;
				height: 60rpx;
				text-align: center;
				line-height: 80rpx;
			}

			.open_right_box {
				width: 652rpx;
				height: 60rpx;
				display: flex;
				justify-content: space-around;

				.open_dange_box {
					width: 130rpx;
					height: 60rpx;
					background: rgba(97, 58, 29, 0.55);
					border-radius: 8rpx 8rpx 8rpx 8rpx;
					font-size: 32rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #C58300;
					text-align: center;
					line-height: 60rpx;
				}

				.open_dange_box1 {
					width: 130rpx;
					height: 60rpx;
					background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
					border-radius: 8rpx 8rpx 8rpx 8rpx;
					font-size: 32rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #fff;
					text-align: center;
					line-height: 60rpx;
				}
			}
		}

		.zuijinScroll_box {
			width: 100%;
			height: calc(100% - 5rpx);

			.jushangci_box {
				width: 100%;
				height: 46rpx;
				font-size: 24rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 34rpx;
				text-align: center;
				margin: 5rpx 0;

				.dawang_box {
					color: #FCA800;
				}

				.mowang_box {
					color: #DB0000;
				}

				.xiyou_box {
					color: #008CFF;
				}
			}

			.zuijinScroll_dange_box3 {
				width: 98%;
				// height: 130rpx;
				margin: auto;
				position: relative;

				background-image: url('https://new.qingfentool.vip/upload/image/20230703/3ec7b7ab9d00719892150b85da4f7345.gif');
				background-size: 100% 100%;
				margin-bottom: 5rpx;

				.nox_box {
					width: 100%;
					height: 90rpx;
					display: flex;
					justify-content: space-around;
					align-items: center;

					.reheader_box {
						width: 76rpx;
						height: 76rpx;
						border-radius: 50%;
						position: relative;

						.txk_box {
							width: 76rpx;
							height: 76rpx;
							border-radius: 50%;
							position: absolute;
							z-index: 2;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.tx_box {
							width: 50rpx;
							height: 50rpx;
							border-radius: 50%;
							position: absolute;
							left: 15rpx;
							top: 13rpx;
							z-index: 1;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

					}

					.retext_box {
						width: 500rpx;
						height: 70rpx;

						.leader_box {
							width: 100%;
							height: 100%;
							line-height: 70rpx;
							text-align: center;
							color: #fff;
							font-size: 34rpx;
						}

						.retop_box {
							width: 100%;
							height: 38rpx;
							display: flex;
							justify-content: flex-start;

							.releft_box {
								width: 200rpx;
								height: 38rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 38rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								margin-right: 10rpx;
							}

							.reright_box {
								height: 34rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}

						.rebot_box {
							width: 100%;
							height: 30rpx;
							display: flex;
							justify-content: space-between;

							.reeeleft_box {
								width: 304rpx;
								height: 30rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.reeert_box {
								width: 100rpx;
								height: 34rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}
					}

					.reimg_box {
						width: 103rpx;
						height: 86rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						// background: red;

						image {
							width: 100%;
							height: 100%
						}
					}
				}

				.last_num {
					margin-left: 20rpx;
					width: 100rpx;
					height: 30rpx;
					line-height: 30rpx;
					color: white;
					text-align: center;
					font-size: 28rpx;
					margin: 0 0 5rpx 0;
				}

				.line_box {
					width: 100%;
					height: 4rpx;
					position: absolute;
					bottom: 0;
					// background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
				}
			}

			.zuijinScroll_dange_box2 {
				width: 98%;
				// height: 130rpx;
				margin: auto;
				position: relative;

				background-image: url('https://new.qingfentool.vip/upload/image/20230703/a10b8a1185cee9a356bb8a2416c8ed0d.gif');
				background-size: 100% 100%;
				margin-bottom: 5rpx;

				.nox_box {
					width: 100%;
					height: 90rpx;
					display: flex;
					justify-content: space-around;
					align-items: center;

					.reheader_box {
						width: 76rpx;
						height: 76rpx;
						border-radius: 50%;
						position: relative;

						.txk_box {
							width: 76rpx;
							height: 76rpx;
							border-radius: 50%;
							position: absolute;
							z-index: 2;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.tx_box {
							width: 50rpx;
							height: 50rpx;
							border-radius: 50%;
							position: absolute;
							left: 15rpx;
							top: 13rpx;
							z-index: 1;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

					}

					.retext_box {
						width: 500rpx;
						height: 70rpx;

						.leader_box {
							width: 100%;
							height: 100%;
							line-height: 70rpx;
							text-align: center;
							color: #fff;
							font-size: 34rpx;
						}

						.retop_box {
							width: 100%;
							height: 38rpx;
							display: flex;
							justify-content: flex-start;

							.releft_box {
								width: 200rpx;
								height: 38rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 38rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								margin-right: 10rpx;
							}

							.reright_box {
								height: 34rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}

						.rebot_box {
							width: 100%;
							height: 30rpx;
							display: flex;
							justify-content: space-between;

							.reeeleft_box {
								width: 304rpx;
								height: 30rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.reeert_box {
								width: 100rpx;
								height: 34rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}
					}

					.reimg_box {
						width: 103rpx;
						height: 86rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						// background: red;

						image {
							width: 100%;
							height: 100%
						}
					}
				}

				.last_num {
					margin-left: 20rpx;
					width: 100rpx;
					height: 30rpx;
					line-height: 30rpx;
					color: white;
					text-align: center;
					font-size: 28rpx;
					margin: 0 0 5rpx 0;
				}

				.line_box {
					width: 100%;
					height: 4rpx;
					position: absolute;
					bottom: 0;
					// background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
				}
			}

			.zuijinScroll_dange_box1 {
				width: 98%;
				// height: 130rpx;
				margin: auto;
				position: relative;

				background-image: url('https://new.qingfentool.vip/upload/image/20230703/d7589c017da4ead3834107bd72239dfd.gif');
				background-size: 100% 100%;
				margin-bottom: 5rpx;

				.nox_box {
					width: 100%;
					height: 90rpx;
					display: flex;
					justify-content: space-around;
					align-items: center;

					.reheader_box {
						width: 76rpx;
						height: 76rpx;
						border-radius: 50%;
						position: relative;

						.txk_box {
							width: 76rpx;
							height: 76rpx;
							border-radius: 50%;
							position: absolute;
							z-index: 2;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.tx_box {
							width: 50rpx;
							height: 50rpx;
							border-radius: 50%;
							position: absolute;
							left: 15rpx;
							top: 13rpx;
							z-index: 1;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

					}

					.retext_box {
						width: 500rpx;
						height: 70rpx;

						.leader_box {
							width: 100%;
							height: 100%;
							line-height: 70rpx;
							text-align: center;
							color: #fff;
							font-size: 34rpx;
						}

						.retop_box {
							width: 100%;
							height: 38rpx;
							display: flex;
							justify-content: flex-start;

							.releft_box {
								width: 200rpx;
								height: 38rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 38rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								margin-right: 10rpx;
							}

							.reright_box {
								height: 34rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}

						.rebot_box {
							width: 100%;
							height: 30rpx;
							display: flex;
							justify-content: space-between;

							.reeeleft_box {
								width: 304rpx;
								height: 30rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.reeert_box {
								width: 100rpx;
								height: 34rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}
					}

					.reimg_box {
						width: 103rpx;
						height: 86rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						// background: red;

						image {
							width: 100%;
							height: 100%
						}
					}
				}

				.last_num {
					margin-left: 20rpx;
					width: 100rpx;
					height: 30rpx;
					line-height: 30rpx;
					color: white;
					text-align: center;
					font-size: 28rpx;
					margin: 0 0 5rpx 0;
				}

				.line_box {
					width: 100%;
					height: 4rpx;
					position: absolute;
					bottom: 0;
					// background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
				}
			}

			.zuijinScroll_dange_box0 {
				width: 98%;
				// height: 130rpx;
				margin: auto;
				position: relative;

				// background-image: url('https://new.qingfentool.vip/upload/image/20230703/a10b8a1185cee9a356bb8a2416c8ed0d.gif');
				// background-size: 100% 100%;
				margin-bottom: 5rpx;

				.nox_box {
					width: 100%;
					height: 90rpx;
					display: flex;
					justify-content: space-around;
					align-items: center;

					.reheader_box {
						width: 76rpx;
						height: 76rpx;
						border-radius: 50%;
						position: relative;

						.txk_box {
							width: 76rpx;
							height: 76rpx;
							border-radius: 50%;
							position: absolute;
							z-index: 2;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.tx_box {
							width: 50rpx;
							height: 50rpx;
							border-radius: 50%;
							position: absolute;
							left: 15rpx;
							top: 13rpx;
							z-index: 1;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

					}

					.retext_box {
						width: 500rpx;
						height: 70rpx;

						.leader_box {
							width: 100%;
							height: 100%;
							line-height: 70rpx;
							text-align: center;
							color: #fff;
							font-size: 34rpx;
						}

						.retop_box {
							width: 100%;
							height: 38rpx;
							display: flex;
							justify-content: flex-start;

							.releft_box {
								width: 200rpx;
								height: 38rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 38rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								margin-right: 10rpx;
							}

							.reright_box {
								height: 34rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}

						.rebot_box {
							width: 100%;
							height: 30rpx;
							display: flex;
							justify-content: space-between;

							.reeeleft_box {
								width: 304rpx;
								height: 30rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.reeert_box {
								width: 100rpx;
								height: 34rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}
					}

					.reimg_box {
						width: 103rpx;
						height: 86rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						// background: red;

						image {
							width: 100%;
							height: 100%
						}
					}
				}

				.last_num {
					margin-left: 20rpx;
					width: 100rpx;
					height: 30rpx;
					line-height: 30rpx;
					color: white;
					text-align: center;
					font-size: 28rpx;
					margin: 0 0 5rpx 0;
				}

				.line_box {
					width: 100%;
					height: 4rpx;
					position: absolute;
					bottom: 0;
					// background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
				}
			}

			.zuijinScroll_dange_box {
				width: 98%;
				// height: 130rpx;
				margin: auto;
				position: relative;

				// background-image: url('https://new.qingfentool.vip/upload/image/20230703/a10b8a1185cee9a356bb8a2416c8ed0d.gif');
				// background-size: 100% 100%;
				margin-bottom: 5rpx;

				.nox_box {
					width: 100%;
					height: 90rpx;
					display: flex;
					justify-content: space-around;
					align-items: center;

					.reheader_box {
						width: 76rpx;
						height: 76rpx;
						border-radius: 50%;
						position: relative;

						.txk_box {
							width: 76rpx;
							height: 76rpx;
							border-radius: 50%;
							position: absolute;
							z-index: 2;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.tx_box {
							width: 50rpx;
							height: 50rpx;
							border-radius: 50%;
							position: absolute;
							left: 15rpx;
							top: 13rpx;
							z-index: 1;

							image {
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

					}

					.retext_box {
						width: 500rpx;
						height: 70rpx;

						.leader_box {
							width: 100%;
							height: 100%;
							line-height: 70rpx;
							text-align: center;
							color: #fff;
							font-size: 34rpx;
						}

						.retop_box {
							width: 100%;
							height: 38rpx;
							display: flex;
							justify-content: flex-start;

							.releft_box {
								width: 200rpx;
								height: 38rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 38rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								margin-right: 10rpx;
							}

							.reright_box {
								height: 34rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}

						.rebot_box {
							width: 100%;
							height: 30rpx;
							display: flex;
							justify-content: space-between;

							.reeeleft_box {
								width: 304rpx;
								height: 30rpx;
								font-size: 22rpx;
								font-family: Source Han Sans CN-Regular, Source Han Sans CN;
								font-weight: 400;
								color: #FFFFFF;
								line-height: 30rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
							}

							.reeert_box {
								width: 100rpx;
								height: 34rpx;
								font-size: 24rpx;
								font-family: Source Han Sans CN-Medium, Source Han Sans CN;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 30rpx;
							}
						}
					}

					.reimg_box {
						width: 103rpx;
						height: 86rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						// background: red;

						image {
							width: 100%;
							height: 100%
						}
					}
				}

				.last_num {
					margin-left: 20rpx;
					width: 100rpx;
					height: 30rpx;
					line-height: 30rpx;
					color: white;
					text-align: center;
					font-size: 28rpx;
					margin: 0 0 5rpx 0;
				}

				.line_box {
					width: 100%;
					height: 4rpx;
					position: absolute;
					bottom: 0;
					// background: linear-gradient(270deg, #FFAA01 0%, #A24B0A 27%, #A24B0B 49%, #A34C0A 73%, #FFAA00 100%);
				}
			}


		}
	}

	.bot_butn_box {
		width: 100%;
		height: 214rpx;
		background: #010129;
		position: fixed;
		bottom: 0;
		z-index: 3;

		.double_box {
			width: 100%;
			height: 112rpx;
			padding: 0 18rpx;

			.double_one_box {
				width: 550rpx;
				height: 30rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin: 15rpx auto;

				.jdt_box {
					width: 476rpx;
					height: 28rpx;

				}

				.baifenbi_box {
					margin-left: 30rpx;
					// width: 100rpx;
					height: 36rpx;
					// background-color: #fff;
					font-size: 24rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					// font-weight: 500;
					color: #FEC700;
					line-height: 40rpx;
					text-align: center;
				}
			}

			.double_anniu_box {
				width: 100%;
				height: 50rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 22rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #7B3F00;
				line-height: 42rpx;

				.jiebeika_box {
					width: 138rpx;
					height: 46rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230713/07f75f6847528dd5228adf2ce3f79c7e.png');
					background-size: 100% 100%;
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					font-size: 22rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #7B3F00;
					line-height: 46rpx;
					text-align: center;
				}

				.jiebeika_txt_box {
					width: 350rpx;
					height: 42rpx;
					font-size: 24rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #FEC700;
					line-height: 42rpx;
					text-align: center;
				}

				.jiebeika_guize_box {
					width: 138rpx;
					height: 46rpx;
					background-image: url('https://new.qingfentool.vip/upload/image/20230713/07f75f6847528dd5228adf2ce3f79c7e.png');
					background-size: 100% 100%;
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					font-size: 22rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #7B3F00;
					line-height: 46rpx;
					text-align: center;
				}
			}

		}

		.cjanniu_box {
			width: 100%;
			height: 100rpx;
			// background: red;
			position: fixed;
			bottom: 0;
			display: flex;
			justify-content: space-between;
			// align-items: center;
			padding: 0 18rpx;

			.one_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/bdd9184415f7cd98f6c5d7ff8046b075.png');
				background-size: 100% 100%;
			}

			.three_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/b87348d201c8abb083f74bb39679c881.png');
				background-size: 100% 100%;
			}

			.five_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/c2e4d55ecfbf6fa2fdbacd533f0160ed.png');
				background-size: 100% 100%;
			}

			.ten_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://new.qingfentool.vip/upload/image/20230725/491f4b0b3f2fd27a16ea374ff9306345.png');
				background-size: 100% 100%;
			}
		}

	}

	.bot_butn_box1 {
		width: 100%;
		height: 138rpx;
		background: #010129;
		position: fixed;
		bottom: 0;

		.cjanniu_box {
			width: 100%;
			height: 138rpx;
			position: fixed;
			bottom: 0;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0 18rpx;

			.one_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/bdd9184415f7cd98f6c5d7ff8046b075.png');
				background-size: 100% 100%;
			}

			.three_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/b87348d201c8abb083f74bb39679c881.png');
				background-size: 100% 100%;
			}

			.five_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230516/c2e4d55ecfbf6fa2fdbacd533f0160ed.png');
				background-size: 100% 100%;
			}

			.ten_open_box {
				width: 24%;
				height: 70rpx;
				background-image: url('https://new.qingfentool.vip/upload/image/20230725/491f4b0b3f2fd27a16ea374ff9306345.png');
				background-size: 100% 100%;
			}
		}

	}

	// 商品详情弹窗
	.shangpin_box {
		width: 100%;
		height: 75vh;
		background-color: #F5F7FB;
		border-radius: 30rpx 30rpx 0 0;
		// padding-top: 72rpx;

		// position: relative;
		// overflow: hidden;
		// overflow: auto;
		.title_box {
			width: 100%;
			height: 74rpx;
			padding-top: 22rpx;
			text-align: center;
			font-size: 36rpx;
			line-height: 50rpx;
			font-family: Source Han Sans CN-Medium, Source Han Sans CN;
			font-weight: 500;
			color: #333333;
			position: fixed;
			top: 0;
			border-radius: 30rpx 30rpx 0 0;
			background-color: #F5F7FB !important;
			z-index: 5;


			.chahao {
				width: 30rpx;
				height: 30rpx;
				position: absolute;
				top: 22rpx;
				right: 22rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}

		.shangpin_top_box {
			width: 100%;
			height: 328rpx;
			background-color: #F5F7FB;
			margin: 72rpx 0 0 0;
			border-radius: 30rpx 30rpx 0 0;




			.xiangqing_pic {
				width: 100%;
				height: 328rpx;
				display: flex;
				justify-content: center;
				align-items: center;

				border-radius: 30rpx 30rpx 0 0;

				.pic {
					width: 240rpx;
					height: 292rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}

		}

		.jiage_box {
			width: 96%;
			height: 194rpx;
			padding-left: 38rpx;
			background-color: #fff;
			border-radius: 6rpx 6rpx 6rpx 6rpx;
			margin: auto;
			// margin-bottom: 22rpx;

			.price_box {
				width: 100%;
				height: 74rpx;
				line-height: 74rpx;
				font-size: 40rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 700;
				color: #FFAE2A;

				text {
					font-size: 32rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #000000;
				}
			}

			.name_box {
				width: 96%;
				height: 80rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				font-size: 28rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #000000;
			}
		}

		.guanggao {
			width: 96%;
			height: 66rpx;
			background-color: #fff;
			margin: auto;
			border-radius: 6rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.fenge {
			width: 100%;
			height: 94rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 22rpx;

			.xiaotxt {
				padding-top: 42rpx;
				width: 400rpx;
				height: 94rpx;
			}
		}

		.xiangqing_box {
			width: 712rpx;
			background-color: #fff;
			margin: auto;
		}
	}

	// 支付
	.cld {
		position: absolute;
		height: 690rpx;
		bottom: 0;
		z-index: 999999999999999;
		width: 100%;
		background-image: url('https://new.qingfentool.vip/upload/image/20230610/b37fd53aa2c388a29ffc8f7b2ed85c1e.png');
		background-size: 100% 100%;

		.zf_top_box {
			width: 100%;
			height: 100rpx;
			margin: auto;
			line-height: 100rpx;

			.fanhuibtn_box {
				width: 6%;
				height: 43%;
				margin-top: 12rpx;
				float: right;
				margin-right: 50rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.shangpin_txt {
				font-weight: 700;
				color: #fff;
				font-size: 29rpx;
				position: absolute;
				left: 50%;
				transform: translate(-50%, 0%);
				margin-left: -46%;
				margin-left: 10rpx;
			}
		}

		.yh_box {
			width: 624rpx;
			height: 460rpx;
			border-radius: 10rpx 10rpx 10rpx 10rpx;
			opacity: 1;
			margin: auto;

			.dangeyh_box {
				width: 624rpx;
				height: 152rpx;
				background-image: url('https://mh.qingfentool.vip/upload/image/20230531/d2320b5b6985a5b861598c5506900b0a.png');
				background-size: 100% 100%;
				margin-bottom: 34rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				position: relative;

				.zhezhao_box {
					position: absolute;
					width: 100%;
					height: 100%;
					background: rgba(0, 0, 0, 0.15);
				}

				.left_box {
					width: 162rpx;
					height: 152rpx;

					.top_txt {
						width: 126rpx;
						height: 90rpx;
						margin: 10rpx auto;

						.mon_box {
							font-size: 36rpx;
							font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
							font-weight: 400;
							color: #FFFFFF;
							line-height: 46rpx;
						}

						.num_box {
							font-size: 80rpx;
							font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
							font-weight: 400;
							color: #FFFFFF;
						}

					}

					.bot_txt {
						// width: 140rpx;
						height: 32rpx;
						font-size: 24rpx;
						font-family: YouSheBiaoTiHei-Bold, YouSheBiaoTiHei;
						font-weight: 400;
						color: #FFFFFF;
						line-height: 32rpx;
						margin: auto;
						text-align: center;
					}
				}

				.right_box {
					width: 436rpx;
					height: 152rpx;

					.top_txt_box {
						width: 100%;
						height: 52rpx;
						font-size: 36rpx;
						font-family: Source Han Sans CN-Bold, Source Han Sans CN;
						font-weight: 700;
						color: #FFFFFF;
						line-height: 52rpx;
						text-align: center;
						margin: 18rpx 0 40rpx;
					}

					.bot_txt_box {
						width: 100%;
						height: 28rpx;
						font-size: 20rpx;
						font-family: Source Han Sans CN-Medium, Source Han Sans CN;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 28rpx;
						text-align: center;
					}
				}
			}


		}

		.querenyhq_box {
			width: 200rpx;
			height: 60rpx;
			text-align: center;
			line-height: 60rpx;
			border-radius: 116rpx;
			margin: 20rpx auto;
			background: linear-gradient(146deg, #FFC95D 0%, #FFAF59 99%);
			color: white;
		}

		.youhui_box {
			width: 98%;
			height: 100rpx;
			margin: auto;
			line-height: 100rpx;
			display: flex;
			justify-content: space-between;
			padding-right: 58rpx;
			padding-left: 10rpx;

			.youhuiquan_box {
				font-size: 32rpx;
				font-weight: 500;
				color: #fff;
			}

			.xuanzequan_box {
				font-size: 31rpx;
				font-weight: 900;
				color: #fff;
			}
		}

		.zongji_box {
			width: 98%;
			height: 100rpx;
			margin: auto;
			line-height: 100rpx;
			display: flex;
			justify-content: space-between;
			padding-right: 58rpx;
			padding-left: 20rpx;

			.zongjia_box {
				font-size: 32rpx;
				font-weight: 500;
				color: #fff;
			}

			.switch_box {
				width: 200rpx;
				height: 100rpx;
				display: flex;
				justify-content: flex-end;
				align-items: center;
			}

			.zongji_money_box {
				font-size: 36rpx;
				font-weight: 900;
				color: #FF3A3A;
			}
		}

		.kaixiang_box {
			margin: auto;
			margin-top: 30rpx;
			margin-bottom: 10rpx;
			background-color: #FFB02E;
			width: 316rpx;
			height: 86rpx;
			font-size: 44rpx;
			line-height: 86rpx;
			color: #FFFFFF;
			font-weight: 500;
			text-align: center;
			border-radius: 10rpx;
			z-index: 99999999999;
		}

		.unpacking_box {
			width: 100%;
			height: 30rpx;
			font-size: 26rpx;
			color: #fff;
			text-align: center;
			line-height: 30rpx;
		}

		.tab_xieyi {
			height: 110rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			padding-top: 29rpx;
			position: absolute;
			left: 194rpx;
			bottom: 37rpx;
			z-index: 600;

			image {
				width: 40rpx;
				height: 40rpx;
			}

			view {
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #3D3D3D;
				padding-left: 20rpx;
			}
		}
	}

	// 霸主
	.lingzhu_big_box {
		position: absolute;
		height: 1300rpx;
		bottom: 0;
		z-index: 99999;
		width: 98%;
		left: 50%;
		margin-left: -49%;

		.guabibangdan {
			width: 100%;
			height: 100rpx;
		}

		.lingzhu_box {
			height: 1198rpx;
			z-index: 99999;
			width: 98%;
			margin: auto;
			// box-shadow: 0rpx -8rpx 34rpx 0rpx rgba(91, 238, 255, 0.43);

			// opacity: 1;
			// border: 2rpx solid #5ABAFF;
			border-radius: 50rpx 50rpx 0 0;
			// background-color: #0A0D20;
			background-image: url('https://mh.qingfentool.vip/upload/image/20230523/e3ce5caab67b8184f10cad7386d33f18.png');
			background-size: 100% 100%;

			.lingzhu_top_box {
				width: 100%;
				height: 90rpx;
				color: white;
				line-height: 90rpx;
				font-size: 28rpx;
				padding: 0 0 0 30rpx;
				display: flex;
				justify-content: flex-start;

				image {
					width: 28rpx;
					height: 28rpx;
					display: inline-block;
					padding-top: 10rpx;
				}
			}

			.bangling_box {
				width: 100%;
				height: 100rpx;
				display: flex;
				justify-content: center;

				.bangdan_box {
					width: 305rpx;
					height: 120rpx;
					// background-color: #30F5FF;
					margin-right: 50rpx;
					position: relative;
				}

				.zhanji_box {
					width: 305rpx;
					height: 120rpx;
					// background-color: #30F5FF;
					margin-left: 50rpx;
					position: relative;
				}

			}

			// 榜单内容
			.bangdan_content_box {
				width: 98%;
				height: 100%;
				margin: 48rpx auto;
				overflow: hidden;
				overflow: auto;

				.zhanji_top_box {
					width: 100%;
					height: 120rpx;
					display: flex;
					padding: 0 11rpx 0 11rpx;
					justify-content: space-between;
					align-items: center;

					.zhanji_topL_box {
						width: 60%;
						height: 120rpx;
						display: flex;
						// background-color: red;
						justify-content: flex-start;
						position: relative;
						align-items: center;

						.lingzhu_pep {
							width: 110rpx;
							height: 40rpx;
							position: absolute;
							right: 26rpx;
							top: 0;

							image {
								width: 100%;
								height: 100%;
							}
						}

						.user_pic {
							width: 120rpx;
							height: 120rpx;
							border-radius: 50%;
							// background-color: #fff;
							position: relative;

							.user_xk_bg_box {
								width: 90rpx;
								height: 90rpx;
								border-radius: 50%;
								position: absolute;
								left: 0;
								right: 0;
								top: 0;
								bottom: 0;
								margin: auto;
							}
						}

						.user_txt {
							width: 156rpx;
							height: 80rpx;
							padding-top: 10rpx;

							// background-color: palegreen;
							.user_txt_one {
								width: 156rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								// line-height: 74rpx;
								text-align: center;
								font-size: 28rpx;
								color: white;
								font-weight: 500;
							}

							.user_txt_two {
								width: 156rpx;
								overflow: hidden;
								text-overflow: ellipsis;
								white-space: nowrap;
								// line-height: 74rpx;
								text-align: center;
								font-size: 18rpx;
								font-weight: 500;
								color: #E8E8E8;
							}
						}
					}

					.zhanji_topR_box {
						font-size: 28rpx;
						font-weight: 500;
						color: white;
						text-align: center;
						width: 20%;
						height: 106rpx;
						line-height: 106rpx;
					}
				}

				.tiaozhanNum {
					width: 100%;
					height: 70rpx;
					line-height: 70rpx;
					color: white;
					font-size: 24rpx;
					text-align: left;
					padding: 0 0 0 24rpx;
					border-top: 2rpx solid rgba(53, 241, 255, 0.1);
				}

				.zhanji_con {
					width: 100%;
					height: 126rpx;
					border-bottom: 1rpx solid #FFB200;
					display: flex;
					margin-top: 40rpx;
					position: relative;
					justify-content: space-between;
					align-items: center;

					.zhanji_con_txt {
						width: 82%;
						height: 126rpx;
						padding-left: 30rpx;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;

						.zhanji_shangpin_box {
							height: 40rpx;
							color: white;
							font-size: 24rpx;
							font-weight: 500;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}

						.zhanji_time_box {
							font-size: 22rpx;
							font-weight: 500;
							color: #C8C8C8;

							margin-top: 40rpx;
						}
					}

					.zhanji_con_pic {
						width: 16%;
						height: 116rpx;
						padding: 20rpx 0 0 0;
						position: absolute;
						top: -60rpx;
						right: 20rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}

					.zhanji_con_lz {
						width: 280rpx;
						position: absolute;
						bottom: 16rpx;
						right: 20rpx;
						text-align: right;
						font-size: 22rpx;
						color: #C8C8C8;
					}
				}

				.bangdan_top_box {
					width: 100%;
					height: 60rpx;
					display: flex;
					padding: 0 11rpx 0 11rpx;
					justify-content: space-between;

					.bangdan_top_txt {
						width: 106rpx;
						height: 100%;
						line-height: 60rpx;
						color: white;
						font-size: 26rpx;
						font-weight: 500;
						text-align: center;
					}

				}

				.connten_box {
					width: 100%;
					height: 900rpx;

					// background-color: #fff;
					.conent_box {
						width: 98%;
						height: 130rpx;
						margin: auto;
						border-bottom: 1rpx solid #FFB200;
						// background-color: #fff;
						display: flex;
						justify-content: space-between;
						align-items: center;

						.paiming_box {
							width: 74rpx;
							height: 74rpx;
							line-height: 74rpx;
							text-align: center;
							margin-left: 11rpx;
							color: white;

							// background-color: yellow;
							image {
								width: 100%;
								height: 100%;
							}
						}

						.ueser_box {
							width: 280rpx;
							height: 104rpx;
							// background-color: olive;
							display: flex;
							justify-content: space-between;
							align-items: center;

							.user_pic {
								width: 120rpx;
								height: 120rpx;
								border-radius: 50%;
								// background-color: #fff;
								position: relative;

								.user_xk_bg_box {
									width: 90rpx;
									height: 90rpx;
									border-radius: 50%;
									position: absolute;
									left: 0;
									right: 0;
									top: 0;
									bottom: 0;
									margin: auto;
								}
							}

							.user_txt {
								width: 156rpx;
								height: 80rpx;
								padding-top: 10rpx;

								// background-color: palegreen;
								.user_txt_one {
									width: 156rpx;
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
									// line-height: 74rpx;
									text-align: center;
									font-size: 28rpx;
									color: white;
									font-weight: 500;
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
								}

								.user_txt_two {
									width: 156rpx;
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
									// line-height: 74rpx;
									text-align: center;
									font-size: 18rpx;
									font-weight: 500;
									color: #E8E8E8;
								}
							}
						}

						.longzhu_box {
							width: 115rpx;
							height: 40rpx;
							// background-color: gold;
							color: white;
							line-height: 40rpx;
							text-align: center;
						}
					}
				}

			}

		}
	}

	.double_big_box {
		position: absolute;
		height: 690rpx;
		bottom: 0;
		z-index: 999999999999999;
		width: 100%;
		background-image: url('https://new.qingfentool.vip/upload/image/20230610/b37fd53aa2c388a29ffc8f7b2ed85c1e.png');
		background-size: 100% 100%;

		.double_top_box {
			width: 100%;
			height: 100rpx;
			margin: auto;
			line-height: 100rpx;

			.fanhuibtn1_box {
				width: 6%;
				height: 43%;
				margin-top: 12rpx;
				float: right;
				margin-right: 50rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.shangpin1_txt {
				font-weight: 700;
				color: #fff;
				font-size: 29rpx;
				position: absolute;
				left: 50%;
				transform: translate(-50%, 0%);
				margin-left: -46%;
				margin-left: 10rpx;
			}
		}

		.jiabei_box {
			width: 712rpx;
			height: 540rpx;
			border-radius: 10rpx 10rpx 10rpx 10rpx;
			margin: auto;

			.double_dg_box {
				width: 712rpx;
				height: 210rpx;
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				background-image: url('https://new.qingfentool.vip/upload/image/20230714/caa483319beb5fa0ed2291e64afb23b8.png');
				background-size: 100% 100%;
				margin-bottom: 20rpx;
				position: relative;

				.shiyong_box {
					width: 162rpx;
					height: 62rpx;
					background: #7C3C00;
					border-radius: 12rpx 12rpx 12rpx 12rpx;
					font-size: 28rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #FFFFFF;
					line-height: 62rpx;
					text-align: center;
					position: absolute;
					top: 88rpx;
					right: 18rpx;
				}

				.double_txt_box {
					width: 100%;
					height: 30rpx;
					text-align: center;
					line-height: 30rpx;
					font-size: 16rpx;
					font-family: Source Han Sans CN-Medium, Source Han Sans CN;
					font-weight: 500;
					color: #FFFFFF;
					position: absolute;
					bottom: 14rpx;
				}
			}
		}

		.double_kong_box {
			width: 500rpx;
			height: 400rpx;
			margin: auto;
			background-image: url('https://new.qingfentool.vip/upload/image/20230714/9b32802be10f31fa5b3a8b4140915dda.png');
			background-size: 100% 100%;
		}

	}
}
</style>